<!DOCTYPE html>
<html data-th-replace="~{admin/layout :: layout(~{::head/content()}, ~{::body/nav/content()}, ~{::body/ul}, ~{::body/form})}">
<head>
    <title data-th-inline="text">Admin | Edit | [[${project.id}]]</title>
</head>
<body>
<nav>
    <ul>
        <li><a data-th-href="@{/admin}">Admin</a></li>
        <li><a data-th-href="@{/admin/projects}">Projects</a></li>
        <li class="is-active"><a data-th-href="@{'/admin/projects/' + ${project.id}}" aria-current="page">Edit</a></li>
    </ul>
</nav>

<ul>
    <li>
        <a data-th-href="@{'/admin/projects/' + ${project.id}}">
            <span class="icon is-small"><i class="far fa-folder-open" aria-hidden="true"></i></span>
            <span>Metadata</span>
        </a>
    </li>
    <li class="is-active">
        <a data-th-href="@{'/admin/projects/' + ${project.id} + '/info'}">
            <span class="icon is-small"><i class="fas fa-info" aria-hidden="true"></i></span>
            <span>Info</span>
        </a>
    </li>
    <li>
        <a data-th-href="@{'/admin/projects/' + ${project.id} + '/releases'}">
            <span class="icon is-small"><i class="fas fa-download" aria-hidden="true"></i></span>
            <span>Releases</span>
        </a>
    </li>
    <li>
        <a data-th-href="@{'/admin/projects/' + ${project.id} + '/support'}">
            <span class="icon is-small"><i class="far fa-calendar-check" aria-hidden="true"></i></span>
            <span>Support</span>
        </a>
    </li>
    <li>
        <a data-th-href="@{'/admin/projects/' + ${project.id} + '/samples'}">
            <span class="icon is-small"><i class="fas fa-code" aria-hidden="true"></i></span>
            <span>Samples</span>
        </a>
    </li>
</ul>

<form data-th-action="@{'/admin/projects/'+${project.id} + '/info'}" method="post" data-th-object="${project}">
    <input type="hidden" data-th-name="id" data-th-value="*{id}"/>
    <div class="columns">
        <div class="column is-half">
            <div class="field">
                <label class="label">Site URL</label>
                <div class="control">
                    <input class="input" data-th-classappend="(${#fields.hasErrors('displaySiteUrl')}? ' is-danger')"
                           type="text" data-th-field="*{displaySiteUrl}" name="displaySiteUrl" placeholder="/projects/spring-boot">
                    <p class="help is-danger" data-th-if="${#fields.hasErrors('displaySiteUrl')}" data-th-errors="*{displaySiteUrl}">
                        Incorrect site URL</p>
                </div>
            </div>

            <div class="field">
                <label class="label">Display Order</label>
                <div class="control">
                    <input class="input" data-th-classappend="(${#fields.hasErrors('displaySortOrder')}? ' is-danger')"
                           type="number"  min="0" max="256" data-th-field="*{displaySortOrder}" name="displaySortOrder">
                    <p class="help is-danger" data-th-if="${#fields.hasErrors('displaySortOrder')}"
                       data-th-errors="*{displaySortOrder}">Incorrect display order</p>
                </div>
            </div>
            <div class="field">
                <label class="label">Path to project icon</label>
                <div class="control">
                    <input class="input" data-th-classappend="(${#fields.hasErrors('displayImagePath')}? ' is-danger')"
                           type="text" data-th-field="*{displayImagePath}" name="displayImagePath"
                           placeholder="/images/projects/spring.svg">
                    <p class="help is-danger" data-th-if="${#fields.hasErrors('displayImagePath')}"
                       data-th-errors="*{displayImagePath}">Incorrect path to project icon</p>
                </div>
            </div>
            <div class="field">
                <label class="label">Project Tag Line</label>
                <div class="control">
                    <textarea class="textarea" data-th-classappend="(${#fields.hasErrors('displayTagLine')}? ' is-danger')"
                              placeholder="Tag line displayed in the projects list."
                              data-th-field="*{displayTagLine}" name="displayTagLine" rows="8"></textarea>
                    <p class="help is-danger" data-th-if="${#fields.hasErrors('displayTagLine')}" data-th-errors="*{displayTagLine}">
                        Incorrect
                        project tag line</p>
                </div>
            </div>
        </div>
        <div class="column is-half">
            <div class="field">
                <label class="label">Groups</label>
                <div class="control">
                    <div class="select is-multiple" data-th-classappend="(${#fields.hasErrors('groups')}? ' is-danger')">
                        <select multiple size="5" name="groups" data-th-field="*{groups}">
                            <option data-th-each="group : ${groups}" data-th-value="${group.name}" data-th-text="${group.label}">
                                Group
                            </option>
                        </select>
                        <p class="help is-danger" data-th-if="${#fields.hasErrors('groups')}" data-th-errors="*{groups}">
                            Incorrect groups</p>
                    </div>
                </div>
            </div>
            <div class="field">
                <label class="checkbox">
                    <input type="checkbox" data-th-field="*{displayFeatured}" name="displayFeatured"> Added to the "Featured" section on the projects page
                </label>
                <div class="control">
                </div>
            </div>
        </div>
    </div>

    <div class="field">
        <label class="label">Spring Boot configuration</label>
        <div class="control">
            <textarea class="textarea"
                      data-th-classappend="(${#fields.hasErrors('bootConfigSource')}? ' is-danger')"
                      placeholder="Tell developers which Spring Boot starter they can use, where to get started in Spring Boot with this project."
                      data-th-field="*{bootConfigSource}" name="bootConfigSource" rows="10"></textarea>
            <p class="help is-danger" data-th-if="${#fields.hasErrors('bootConfigSource')}" data-th-errors="*{bootConfigSource}">
                Incorrect
                Spring Boot configuration</p>
        </div>
        <p>Please use the Asciidoc format.</p>
    </div>
    <div class="field">
        <label class="label">Project Overview</label>
        <div class="control">
            <textarea class="textarea" data-th-classappend="(${#fields.hasErrors('overviewSource')}? ' is-danger')"
                      placeholder="Documentation displayed in the overview tab on the project page."
                      data-th-field="*{overviewSource}" name="overviewSource" rows="20"></textarea>
            <p class="help is-danger" data-th-if="${#fields.hasErrors('overviewSource')}" data-th-errors="*{overviewSource}">
                Incorrect
                project overview</p>
        </div>
        <p>Please use the Asciidoc format.</p>
    </div>

    <div class="buttons control is-centered">
        <button type="submit" class="button is-primary">Save</button>
        <a class="button" data-th-href="@{'/admin/projects/' + ${project.id}}">Cancel</a>
    </div>
</form>
</body>
</html>
